import React from "react";
import {Route} from "react-router";
import Loadable from 'react-loadable';
import Loading from '../components/Loading';

export function renderRoutes(routes = [],extraProps={}) {
    return (
        routes && routes.map((route, i) => {
            return <Route key={route.key || i} path={route.path} exact={route.exact} strict={route.strict} render={
                (props) => {
                    if (route.render) {
                        return route.render(Object.assign({}, props, extraProps, {route}));
                    } else {
                        return React.createElement(typeof route.component == 'function' ? Loadable({
                            loading: Loading,
                            loader: route.component
                        }) : route.component, Object.assign({}, props, {route}), route.routes && renderRoutes(route.routes,extraProps))
                    }
                }
            }/>
        })
    ) || null
}